<template>
 <div>
         新闻标题：<el-input v-model="news.title" placeholder="请输入新闻标题" style="width: 30%"></el-input>

     <div>新闻内容：
        <div id="wangeditor">
         <div ref="editorElem" style="text-align:left;"></div>
     </div>
         <el-button type="primary" size="small" @click="submitNews">提交</el-button>
     </div>

 </div>

  </template>
  <script>
      import E from "wangeditor";
      export default {
          name: "Editor",
      data(){
          return {
              editor: null,
               news: {
               title:'',
               info:''
           }
          }
      },
          mounted() {
              this.editor = new E(this.$refs.editorElem);
              this.editor.customConfig.showLinkImg = true;
              this.editor.customConfig.uploadImgServer = 'http://121.196.151.13:8088/upload/picture';
              this.editor.customConfig.uploadFileName = 'file';

              // 编辑器的事件，每次改变会获取其html内容
              this.editor.customConfig.onchange = html => {
                  this.news.info = html;
              };
              this.editor.customConfig.menus = [
                  // 菜单配置
                  'head', // 标题
                  'bold', // 粗体
                  'fontSize', // 字号
                  'fontName', // 字体
                  'italic', // 斜体
                  'underline', // 下划线
                  'strikeThrough', // 删除线
                  'foreColor', // 文字颜色
                  'backColor', // 背景颜色
                  'link', // 插入链接
                  'list', // 列表
                  'justify', // 对齐方式
                  'quote', // 引用
                  'emoticon', // 表情
                  'image', // 插入图片
                  'table', // 表格
                  'code', // 插入代码
                  'undo', // 撤销
                  'redo' // 重复
              ];
              this.editor.create();
          },
      methods:{
          submitNews(){
              console.log(this.news.title+"kjhajdhaj生活");
                  this.centralControl.axios.centralControl(
                      'addNews',
                      res => {
                          this.$message({
                              message: '添加新闻成功',
                              type: 'success'
                          });
                          this.$router.push("/adminHome")
                      },
                      this.news
                  );
          }

      }
  }
  </script>
  <style lang="less" scoped>
  .right-nr {
      font-size: 16px;
      color: #666;
      position: relative;
      padding-bottom: 50px;
  }
  .view-title {
    text-align: center;
    line-height: 28px;
    color: #333;
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 18px;
    margin-top: 20px;
    h1 {
        color: red;
        font-size: 18px;
    }
}
.view-info {
    text-align: center;
    color: #999;
}
.view-info span {
    font-size: 14px;
    font-weight: normal;
}
.view-cnt {
    margin-top: 10px;
    line-height: 29px;
}

  </style>
